<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<script type="text/javascript" src="script/jquery.js"></script>
<link href="style/bootstrap.css" rel="stylesheet">
<script type="text/javascript" src="script/bootstrap-modal.js"></script>
</head>
<body>
	<h4>已有商品列表</h4>
	<div class="span8">
		<table class="table table-striped">
			<thead>
				<tr>
					<th>商品编号&nbsp;&nbsp;&nbsp;</th>
					<th>名称&nbsp;&nbsp;&nbsp;</th>
					<th>价格&nbsp;&nbsp;&nbsp;</th>
					<th>是否上架&nbsp;&nbsp;&nbsp;</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<c:if test="${empty list }">
					<tr>
						<td colspan="3">暂时没有数据.....</td>
					</tr>
				</c:if>
				<c:forEach var="pro" items="${list }">
					<tr>
						<td>${pro.bianhao }</td>
						<td>${pro.name }</td>
						<td>${pro.price }</td>
						<td>${pro.isONload }</td>

						<td><a href="javascript:void(0)" id="editPro">编辑</a> <a
							href="javascript:void(0)" id="delete">删除</a> <a
							href="javascript:void(0)" id="show" onclick="show()">查看</a></td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
	</div>
	<h4>添加商品</h4>
	商品编号:
	<input type="text" id="bianhao" /> 商品名称:
	<input type="text" id="productname" />
	<br /> 商品价格:
	<input type="text" id="price" /> 是否上架:
	<input type="radio" id="ison" name="rad" /> 是
	<input type="radio" id="not" name="rad" /> 否
	<input type="button" value="添加" onclick="add()">
</body>

<script type="text/javascript">
	var xmlHttp;

	/*创建XMLHttpRequest对象*/
	function createXMLHttpRequest() {
		if (window.ActiveXObject) {
			//IE
			xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
		} else {
			//chrome firefox opera 
			xmlHttp = new XMLHttpRequest();
		}
	}

	function add() {
		createXMLHttpRequest();

		var bianhao = document.getElementById("bianhao").value;

		var productname = document.getElementById("productname").value;
		var price = document.getElementById("price").value;
		var is = document.getElementById("ison").checked;
		//alert(is);

		if (is) {
			is = true;
		} else {
			is = false;
		}

		xmlHttp.open("GET", "product.jspx?bianhao=" + bianhao + "&name="
				+ encodeURIComponent(productname) + "&price=" + price + "&ison=" + is, true);
		xmlHttp.onreadystatechange = callback;
		xmlHttp.send();
	}

	function callback() {
		var xml = xmlHttp.responseXML;

		var datas = xml.getElementsByTagName("dat");

		var nowpr = datas[0];

		var node = nowpr.getElementsByTagName("recode1")[0]
				.getAttribute("date");
		var name = nowpr.getElementsByTagName("recode2")[0]
				.getAttribute("date");
		var price = nowpr.getElementsByTagName("recode3")[0]
				.getAttribute("date");
		var isOr = nowpr.getElementsByTagName("recode4")[0]
				.getAttribute("date");
		/* alert(node);
		alert(name);
		alert(price);
		alert(isOr); */
		var tr = document.createElement("tr");
		var td1 = document.createElement("td");
		td1.appendChild(document.createTextNode(node));
		var td2 = document.createElement("td");
		td2.appendChild(document.createTextNode(name));
		var td3 = document.createElement("td");
		td3.appendChild(document.createTextNode(price));
		var td4 = document.createElement("td");
		td4.appendChild(document.createTextNode(isOr));

		var a = document.createElement("a");
		a.setAttribute("href", "javascript:void(0)");
		a.setAttribute("id", "edit");
		a.appendChild(document.createTextNode("编辑  "));

		var b = document.createElement("a");
		b.setAttribute("href", "javascript:void(0)");
		b.setAttribute("id", "del");
		b.appendChild(document.createTextNode("删除 "));

		var c = document.createElement("a");
		c.setAttribute("href", "javascript:void(0)");
		c.setAttribute("id", "chakan");
		c.appendChild(document.createTextNode("查看"));

		/* a.onclick = editRow;
		b.onclick = delRow; */

		var td5 = document.createElement("td");
		td5.appendChild(a);
		td5.appendChild(b);
		td5.appendChild(c);

		tr.appendChild(td1);
		tr.appendChild(td2);
		tr.appendChild(td3);
		tr.appendChild(td4);
		tr.appendChild(td5);

		document.getElementsByTagName("tbody")[0].appendChild(tr);
	}
	/* document.getElementById("edit").onclick = editRow;
	document.getElementById("del").onclick = delRow; 
	document.getElementById("show").onclick = show;*/

	function show() {
		//createXMLHttpRequest();
		
		var showBianhao = document.getElementsByTagName("tbody")[0]
				.getAttribute("tr");
		
		var showName = document.getElementsByTagName("tbody")[0]
				.getAttribute("tr");
		var showPrice = document.getElementsByTagName("tbody")[0]
				.getAttribute("tr");
		var showIsOr = document.getElementsByTagName("tbody")[0]
				.getAttribute("tr");
		alert(showBianhao);
		alert(showName);
		alert(showPrice);
		
		
		document.getElementById("bianhao").innerHTML=showBianhao;
		document.getElementById("productname").innerHtml=showName;
		document.getElementById("price").innerHtml=showPrice;
		
		if(showIsOr==true){
			document.getElementById("ison").selected;
		}
		if(showIsOr=false){
			document.getElementById("not").selected;
		};
	}
	function delRow() {
	}
</script>
</html>
